<template>
  <a-menu
    theme="dark"
    mode="inline"
    :selected-keys="selectedKeys"
    :open-keys="openKeys"
    @click="onMenuClick"
    @openChange="onOpenChange"
  >
    <a-sub-menu key="tenant">
      <span slot="title">
        <a-icon type="team" />
        <span>租户设置</span>
      </span>
      <a-menu-item key="/settings/tenant">
        租户管理
      </a-menu-item>
      <a-menu-item key="/settings/account">
        账户管理
      </a-menu-item>
    </a-sub-menu>
    <a-menu-item key="/settings/user">
      <a-icon type="user" />
      <span>用户管理</span>
    </a-menu-item>
    <a-menu-item key="/settings/role">
      <a-icon type="robot" />
      <span>角色管理</span>
    </a-menu-item>
    <a-menu-item key="/settings/bookmark">
      <a-icon type="book" />
      <span>页签设置</span>
    </a-menu-item>
    <a-menu-item key="/settings/audit-log">
      <a-icon type="file-protect" />
      <span>审计日志</span>
    </a-menu-item>
    <a-menu-item key="/settings/sms">
      <a-icon type="message" />
      <span>短信发送设置</span>
    </a-menu-item>
    <a-menu-item key="/settings/email">
      <a-icon type="mail" />
      <span>邮件发送设置</span>
    </a-menu-item>
  </a-menu>
</template>
<script lang="ts">
import { Component, Mixins } from 'vue-property-decorator'

import MenuBarMixin from './menu-bar.mixin'

@Component
export default class SettingsMenu extends Mixins(MenuBarMixin) {
  private created () {
    this.pathKeys = {
      '/settings/tenant': 'tenant',
      '/settings/account': 'tenant'
    }
  }
}
</script>
